<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/html"><head>
    <meta charset="utf-8">
    <title>{include file="common/title"}</title>

    <meta name="description" content="Dashboard">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--Basic Styles-->
    <link href="__DATA__/admin/style/bootstrap.css" rel="stylesheet">
    <link href="__DATA__/admin/style/font-awesome.css" rel="stylesheet">
    <link href="__DATA__/admin/style/weather-icons.css" rel="stylesheet">

    <!--Beyond styles-->
    <link id="beyond-link" href="__DATA__/admin/style/beyond.css" rel="stylesheet" type="text/css">
    <link href="__DATA__/admin/style/demo.css" rel="stylesheet">
    <link href="__DATA__/admin/style/typicons.css" rel="stylesheet">
    <link href="__DATA__/admin/style/animate.css" rel="stylesheet">
</head>
<body>
<!-- 头部 -->
{include file="common/top"}
<!-- /头部 -->

<div class="main-container container-fluid">
    <div class="page-container">
        <!-- Page Sidebar -->
        {include file="common/left"}
        <!-- /Page Sidebar -->
        <!-- Page Content -->
        <div class="page-content">
            <!-- Page Breadcrumb -->
            <div class="page-breadcrumbs">
                <ul class="breadcrumb">
                    <li class="active">控制面板</li>
                </ul>
            </div>
            <!-- /Page Breadcrumb -->

            <!-- Page Body -->
            <!--正文-->
            <div class="page-body">
                <style>
                    /*.bootstrap-switch .bootstrap-switch-handle-on.bootstrap-switch-primary, .bootstrap-switch .bootstrap-switch-handle-off.bootstrap-switch-primary {color: #fff;background: #a0053b;}*/
                    /*.btn-primary {color: #fcfafa;background-color: #3b3063;border-color: #ffffff;}*/
                    /*.list-group .list-group-item.active {background-color: #3b3063;border-color: #f3f0f2;}*/
                    /*.nav-tabs > li.active > a, .nav-tabs > li.active > a:hover, .nav-tabs > li.active > a:focus {color: #FFF;background-color: #c83716;border-color: #c83716;}*/
                    /*.nav.nav-tabs {margin-bottom: 10px;border-color: #c83716;}*/
                    /*.btn-default {color: #f4eeee;background-color: #169786;border-color: #f2f7f7;}*/
                    /*.panel-info > .panel-heading {color: #fbfdfe;background-color: #179786;border-color: #49a2b4;}*/
                    /*.pagination > .active > a, .pagination > .active > span, .pagination > .active > a:hover, .pagination > .active > span:hover, .pagination > .active > a:focus, .pagination > .active > span:focus {z-index: 2;color: #fff;cursor: default;background-color: #3b3063;border-color: #3b3063;}*/
                    /*.daterangepicker .ranges li.active, .daterangepicker .ranges li:hover {background: #3b3063;border: 1px solid #3b3063;color: #fff;}*/
                    /*.daterangepicker td.active, .daterangepicker td.active:hover {background-color: #d9534f;border-color: #ffffff;color: #fff;}*/
                    /*.input-group-addon {padding: 6px 12px;font-size: 14px;font-weight: 400;line-height: 1;color: #555;text-align: center;background-color: #e2a385;border: 1px solid #ccc;border-radius: 4px;}*/
                    /*.form-control-excel {height: 34px;padding: 6px 12px;font-size: 14px;line-height: 1.42857143;color: #555;background-color: #fff;background-image: none;border: 1px solid #ccc;border-radius: 4px;-webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);box-shadow: inset 0 1px 1px rgba(0,0,0,.075);-webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;-o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;}*/
                    /*.ibox {clear: both;margin-bottom: 25px;margin-top: 0;padding: 0;}*/
                    /*.ibox-title {-moz-border-bottom-colors: none;-moz-border-left-colors: none;-moz-border-right-colors: none;-moz-border-top-colors: none;background-color: #ffffff;border-color: #e7eaec;-webkit-border-image: none;-o-border-image: none;border-image: none;border-width: 4px 0px 0;color: inherit;margin-bottom: 0;padding: 14px 15px 7px;min-height: 48px;}*/
                    /*.ibox-content {clear: both;background-color: #ffffff;color: inherit;padding: 15px 20px 20px 20px;border-color: #e7eaec;-webkit-border-image: none;-o-border-image: none;border-image: none;border-style: solid solid none;border-width: 1px 0px;}	*/
                    /*.text-info {color: #23c6c8;}*/
                    /*.font-bold {font-weight: 600;}*/
                    /*.stat-percent {float: right;}*/
                    /* 门店图片 */
                    .panel-slide{position: relative;}
                    .panel-slide .btnClose{position: absolute; top:-10px; right:-10px; width:30px; height: 30px; border-radius: 30px;background: #eee; font-size: 16px; cursor: pointer; color:#FFF; text-align: center; line-height: 30px}
                    .panel-slide .btnClose:hover{background: red}
                    .panel-slide .panel-body div{margin-top: 10px}
                </style>

                <style type="text/css">
                    .nav-tabs>li>a:hover{
                        color: #333;
                        border-color: #31C2A5;
                        background-color: white;
                    }
                    .nav-tabs > li.active > a,.nav-tabs > li.active > a:hover{
                        background-color: #31C2A5;
                        color: white;
                        border-color: #31C2A5;
                    }
                    .nav.nav-tabs{border-color: #31C2A5;margin-top: 30px;}
                    .panel-default>.panel-heading{font-weight: bold;background-color: #F3F3F3;}
                    .yg14{margin-top: 30px;}
                    .store_td1{height: 45px;}
                    .yg5_tabel{border-color: #e5e5e5;outline: 1px solid #e5e5e5;}
                    .yg5_td{
                        padding: 10px;
                        text-align: center;
                        display: flex;
                        justify-content: center;
                        align-items: center;
                        flex-direction: column;
                    }
                    .tabel_yuan{width: 15px;height: 15px;border: 3px solid white;border-radius: 50%;margin-right: 5px;}
                    .tabel_btn{margin-right: 10px;}
                    .tabel_btn>div{float: left;line-height: 15px;}
                    .tabel_wai{margin: 20px 0px;}
                    .tabel_erwei{width: 17px;height: 17px;float: left;margin-right: 5px;}
                    .tabel_seach{padding-left: 10px;width: 150px;height: 30px;border-radius: 4px;border: 1px solid #e5e5e5;}
                    .tabel_sele{width: 120px;height: 30px;margin-right: 10px;}
                    .tabel1{background-color: #555555;}
                    .tabel2{background-color: #EF4437;}
                    .tabel3{background-color: #428BCA;}
                    .tabel4{background-color: #5CB85C;}
                    .tabel1_label{color: #5CB85C;margin-top: 20px;}
                    .tabel_in{width: 100px;}
                    .tabel1_labe2{width: 140px;padding: 10px 0px;background-color: #EEEEEE;margin:10px auto 0px;}
                    .yg5_td>a>div:nth-child(1){margin:0px auto;width: 100px;height: 100px;line-height: 100px;color: white;border-radius: 50%;font-size: 18px;}
                    .yg5_td{position: relative;}
                    .tabel_cha{position: absolute;font-size: 28px;top: 0px;right: 0px;font-weight: bold;}
                    .tabel_cha>a{color: red;}
                    .spanyg{color: #999;font-size: 12px;display: none;}
                    .tabel_cha>a:hover .spanyg{display: block;}
                </style>
                <!--测试-->
                <ul class="nav nav-tabs">
                    <li class="active"><a href="{:url('business/table/index')}">餐桌列表</a></li>
                    <li><a href="{:url('business/table/create')}">添加餐桌</a></li>
                </ul>
                <div id="qrcode"></div>
                <div class="main">
                    <div class="panel panel-default">
                        <div class="panel-heading">
                            桌台列表
                        </div>
                        <div class="panel-body" style="padding: 0px 15px;">
                            <div class="row">
                                <div class="col-md-12 tabel_wai">
                                    <form  action="{:url('business/table/search')}" method="POST">
                                        <a class="btn btn-primary btn-sm tabel_btn" href="{:url('business/table/create')}">
                                            新建桌台
                                        </a>
                                        <a class="btn btn-danger btn-sm tabel_btn" href="{:url('business/table/changeAllStatus')}">
                                            一键清台
                                        </a>
                                        <input class="tabel_seach" type="text" name="table_name" placeholder="餐桌名称">
                                        <select class="tabel_sele" name="table_classify">
                                            {volist name="classify" id="v"}
                                            <option value="{$v.classify_name}">{$v.classify_name}</option>
                                            {/volist}
                                        </select>
                                        <input class="btn btn-success btn-sm tabel_btn" type="submit" value="搜索">
                                    </form>
                                </div>

                                <div class="yg5_tabel col-md-12">
                                    <div class="yg5_tr1">
                                        {volist name="data" id="value"}
                                        <div class="col-md-2 yg5_td">
                                            <div class="tabel_cha">
                                                <a onclick="if(!confirm('删除后将不可恢复,确定删除吗?')) return false;" href="{:url('business/table/delete',array('id' => $value.id))}"><span class="">×</span>
                                                    <span class="spanyg">删除</span>
                                                </a>
                                            </div>
                                            <a href="{:url('business/table/edit',array('id' => $value.id))}">
                                                {switch name="$value['table_status']"}
                                                {case value="1"}
                                                <div class="tabel1">
                                                空闲
                                                </div>
                                                {/case}
                                                {case value="2"}
                                                <div class="tabel2">
                                                已开台
                                                </div>
                                                {/case}
                                                {case value="3"}
                                                <div class="tabel3">
                                                已下单
                                                </div>
                                                {/case}
                                                {default /}
                                                <div class="tabel4">
                                                已支付
                                                </div>
                                                {/switch}
                                            </a>
                                            <div class="tabel1_label">类型：{$value.table_classify}</div>
                                            <div class="tabel1_label">标签：{$value.table_tag}</div>
                                            <div class="tabel1_labe2">
                                                <div>{$value.table_name}</div>
                                                <form action="{:url('business/table/changeStatus')}" method="POST">
                                                    <select style="margin-top: 10px;" id="status" name="table_status" onchange="$(this.form).submit();">
                                                        <option value="1" {if condition="$value['table_status'] eq 1 "} selected {/if} >空闲</option>
                                                        <option value="2" {if condition="$value['table_status'] eq 2 "} selected {/if} >已开台</option>
                                                        <option value="3" {if condition="$value['table_status'] eq 3 "} selected {/if} >已下单</option>
                                                        <option value="4" {if condition="$value['table_status'] eq 4 "} selected {/if} >已支付</option>
                                                    </select>
                                                    <input type="hidden" name="id" value="{$value.id}" />
                                                    <div style="display: none">
                                                        <input type="submit" />
                                                    </div>
                                                </form>
                                            </div>
                                            <a class="btn btn-info btn-sm tabel_btn" target="_blank" href="http://qr.liantu.com/api.php?text=https://app.yizhizaibo.cn/eat/business/code/encrypts/id/{$value.id}/code/{$value.table}">
                                                查看当前餐桌二维码
                                            </a>
                                        </div>
                                        {/volist}
                                    </div>
                                    <div class="yg5_tr2">
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </div>
                </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
</div>
</body>
<script>
    var qrcode = new QRCode('qrcode', {
        text: 'your content',
        width: 256,
        height: 256,
        colorDark: '#000000',
        colorLight: '#ffffff',
        correctLevel: QRCode.CorrectLevel.H
    });
</script>
<script src="__DATA__/admin/qrcodejs/qrcode.min.js"></script>
            <!--Basic Scripts-->
            <script src="__DATA__/admin/style/jquery_002.js"></script>
            <script src="__DATA__/admin/style/bootstrap.js"></script>
            <script src="__DATA__/admin/style/jquery.js"></script>
            <!--Beyond Scripts-->
            <script src="__DATA__/admin/style/beyond.js"></script>
<script>
    $(function(){
        $('.canzhuo').css('display','block');
    });
</script>
</body></html>